<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>Angular的学习</title>
	</head>
	<body ng-app="app1">
		<!-- ng-app="app1" 模块ID， ng-controller="ctl1" 模块控制ID-->
		<div ng-controller="ctl1">
			<!-- ng-model="firstName" 双向绑定-->
			名: <input type="text" ng-model="firstName"><br>
			姓: <input type="text" ng-model="lastName"><br>
			<br>
			姓名: {{firstName + " " + lastName}} <br/ >
				{{ AAA }}
		</div>
		
		<div ng-controller="ctl2" data-ng-init="load()">
			<table border="" cellspacing="" cellpadding="">
				<tr ng-repeat="x in lists" ng-click="onDetailClick(x)">
		            <td>{{$index+1}}</td>
		            <th>{{x.Country}}</th>
		            <td>{{x.Name}}</td>
		            <td>{{x.Url}}</td>
	        	</tr>
			</table>
		</div>
	</body>
<script type="text/javascript" src="../js/angular.js" ></script>
<script>
//	angularjs 中只能有一个模块module(ng-app="")，一个模块可以有多个控制器（ng-controller=""）
// 创建模块
var app = angular.module('app1', []);
// 控制模块
app.controller('ctl1', function($scope) {
    $scope.firstName= "John";
    $scope.lastName= "Doe";
    $scope.AAA= "BBB";
});

// 使用模块
app.controller('ctl2',
function($scope, $http,$location) { // 注入对象
    console.log("$location.absUrl() -> ",$location.absUrl());
    var Request = new UrlSearch(); //实例化
    // 拿到参数
    $scope.country=Request.country;
    $scope.town=Request.town;
    $scope.village=Request.village;
    
    // 对应的 div 中的init='load()' 函数初始化就加载
    $scope.load=function(){
        $http.get("http://www.runoob.com/try/angularjs/data/sites.php")
            .then(
        	(res) =>  {
                console.log("res -> ",res);
                console.log("res.data.sites -> ",res.data.sites);
                $scope.lists=res.data.sites;
            },
            function (err) {
            	conosle.log("request error!")
            });
            
    }

	// 绑定的函数
    $scope.onDetailClick = function (x) {
//      window.location.href="account_detail.html?id="+id;
		console.log("点击的",x)
    };
    
});

// 自定义的函数
function UrlSearch() {
    var name, value;
    var str = location.href; //取得整个地址栏
    console.log("地址="+str);
    var num = str.indexOf("?");
    str = str.substr(num + 1); //取得所有参数   stringvar.substr(start [, length ]

    var arr = str.split("&"); //各个参数放到数组里
    console.log("各个参数放到数组里="+arr);
    for (var i = 0; i < arr.length; i++) {
        num = arr[i].indexOf("=");
        if (num > 0) {
            name = arr[i].substring(0, num);
            value = arr[i].substr(num + 1);
            this[name] = value;
        }
    }
}
</script>
</html>
